<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>login</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <link href="../static/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="../static/axure/data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="../static/axure/files/login/styles.css" type="text/css" rel="stylesheet"/>
    <script src="../static/js/vue.js"></script>
    <script src="../static/js/axios.js"></script>
    <script src="../static/element-ui/index.js"></script>
    <link rel="stylesheet" href="../static/element-ui/index.css">
    <link rel="stylesheet" href="../static/css/GL-login.css">
    <link rel="stylesheet" href="../static/css/CDL.css">
    <style>
        #div1 {
            width: 100%;
            height: 100%;
            position: absolute;
            backface-visibility: hidden;
            z-index: 3;
        }

        #div2 {
            width: 100%;
            height: 100%;
            backface-visibility: hidden;
            transform: rotateX(180deg);
            z-index: 3;
        }

        .ldiv {
            transform-style: preserve-3d;
            transition: transform 0.5s;
            transform-origin: center;
        }

        .flipped {
            transform: rotateX(180deg);
        }
    </style>
</head>
<body>
<div id="base" class="">
    <div class="ldiv" style="width: 100%;height: 100%;position: relative" :class="{ flipped: isadmin}">
        <div id="div1" v-show="!isadmin">
            <div id="u0" class="ax_default" data-left="250" data-top="142" data-width="358" data-height="455">
                <!-- 登录框 -->
                <div id="u1" class="ax_default box_1">
                    <img id="u1_img" class="img " src="../static/axure/images/login/u1.svg" alt=""/>
                    <div id="u1_text" class="text " style="display:none; visibility: hidden">
                        <p></p>
                    </div>
                </div>
            </div>

            <!-- 忘记密码界面 -->
            <el-dialog
                    title="提示"
                    :visible.sync="isforget"
                    width="30%"
                    append-to-body
            >
                <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px"
                         class="demo-ruleForm">
                    <el-form-item label="邮箱" prop="email">
                        <el-input type="email" v-model="ruleForm.email" autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="密码" prop="pass">
                        <el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="确认密码" prop="checkPass">
                        <el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="验证码" prop="code">
                        <el-input type="text" v-model="ruleForm.code" autocomplete="off" style="width: 50%"></el-input>
                        <el-button type="primary" v-show="!issend" @click="send_email">发送</el-button>
                        <el-button type="success" disabled v-show="issend">已发送</el-button>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="forget_pwd">提交</el-button>
                        <el-button @click="isforget=false">返回</el-button>
                    </el-form-item>
                </el-form>
            </el-dialog>
            <!-- 表单标题 -->
            <div id="u2" class="ax_default _二级标题" style="cursor: pointer" @click="isadmin=true">
                <div id="u2_div" class=""></div>
                <div id="u2_text" class="text ">
                    <p><span>不摸鱼博客</span></p>
                </div>
            </div>

            <div id="u5" class="ax_default label">
                <div id="u5_text" class="text ">
                    <p><span>账号</span></p>
                </div>
            </div>
            <!-- 账号输入 -->
            <div id="u3" class="ax_default text_field">
                <div id="u3_div" class=""></div>
                <input id="u3_input" type="text" value="" class="u3_input" v-model="user.username"/>
            </div>

            <div id="u6" class="ax_default label">
                <div id="u6_text" class="text ">
                    <p><span>密码</span></p>
                </div>
            </div>
            <!-- 密码输入 -->
            <div id="u4" class="ax_default text_field">
                <div id="u4_div" class=""></div>
                <input id="u4_input" type="password" value="" class="u4_input" v-model="user.password"/>
            </div>

            <div id="u11" class="ax_default label">
                <div id="u11_div" class=""></div>
                <div id="u11_text" class="text ">
                    <p><span>验证码</span></p>
                </div>
            </div>
            <!-- 验证码输入 -->
            <div id="u10" class="ax_default text_field">
                <div id="u10_div" class=""></div>
                <input id="u10_input" v-model="user.code" type="text" value="" class="u10_input"/>
            </div>
            <!-- 刷新验证码 -->
            <div id="u12" class="ax_default primary_button" style="cursor: pointer" @click="get_code">
                <div id="u12_div" class=""></div>
                <div id="u12_text" class="text ">
                    <p><span v-text="real_code"></span></p>
                </div>
            </div>


            <!-- 登录提交  -->
            <div id="u7" class="ax_default button">
                <img id="u7_img" class="img " src="../static/axure/images/login/u7.svg"/>
                <div id="u7_text" class="text " style="cursor: pointer" @click="login(0)">
                    <p><span>登录</span></p>
                </div>
            </div>

            <!-- 注册跳转 -->
            <div id="u8" class="ax_default button" @click="to_Sign" style="cursor: pointer">
                <img id="u8_img" class="img " src="../static/axure/images/login/u8.svg" alt=""/>
                <div id="u8_text" class="text ">
                    <p><span>注册</span></p>
                </div>
            </div>

            <!-- 忘记密码跳转 -->
            <div id="u9" class="ax_default link_button" @click="to_forget" style="cursor: pointer">
                <div id="u9_div" class=""></div>
                <div id="u9_text" class="text ">
                    <p><span>忘记密码？</span></p>
                </div>
            </div>
        </div>
        <div id="div2" v-show="isadmin">
            <div id="u09" class="ax_default" data-left="250" data-top="142" data-width="358" data-height="455">
                <!-- 登录框 -->
                <div id="u19" class="ax_default box_1">
                    <img id="u19_img" class="img " src="../static/axure/images/login/u1.svg" alt=""/>
                    <div id="u19_text" class="text " style="display:none; visibility: hidden">
                        <p></p>
                    </div>
                </div>
            </div>

            <!-- 表单标题 -->
            <div id="u29" class="ax_default _二级标题" style="cursor: pointer" @click="isadmin=false">
                <div id="u29_div" class=""></div>
                <div id="u29_text" class="text ">
                    <p><span>不摸鱼管理</span></p>
                </div>
            </div>

            <div id="u59" class="ax_default label">
                <div id="u59_text" class="text ">
                    <p><span>账号</span></p>
                </div>
            </div>
            <!-- 账号输入 -->
            <div id="u39" class="ax_default text_field">
                <div id="u39_div" class=""></div>
                <input id="u39_input" type="text" value="" class="u3_input" v-model="admin.username"/>
            </div>

            <div id="u69" class="ax_default label">
                <div id="u69_text" class="text ">
                    <p><span>密码</span></p>
                </div>
            </div>
            <!-- 密码输入 -->
            <div id="u49" class="ax_default text_field">
                <div id="u49_div" class=""></div>
                <input id="u49_input" type="password" value="" class="u4_input" v-model="admin.password"/>
            </div>

            <!-- 登录提交  -->
            <div id="u79" class="ax_default button">
                <img id="u79_img" class="img " src="../static/axure/images/login/u7.svg"/>
                <div id="u79_text" class="text " style="cursor: pointer" @click="login(1)">
                    <p><span>登录</span></p>
                </div>
            </div>

        </div>
    </div>
</div>
<script src="../static/js/login.js"></script>


</body>
</html>